<template>
  <div>
    <el-dialog
      :visible.sync="dialogTableVisibletextarea"
      custom-class="sorting-code-number"
      maxHeight="null"
      title="发票导入"
      width="999px"
      :before-close="beforeClose"
    >
      <el-tabs
        v-model="activeName"
        @tab-click="handletabClick"
        class="el-tabs__customize"
      >
        <el-tab-pane label="专票引入" name="a">
          <div class="el-dialog__body-header invoice-Search">
            <el-search
              :formProp="formData"
              :showIndex="showIndex"
              @change="change"
              @search="search"
              placement="bottom-start"
              width="960px"
            >
              <template slot="search">
                <el-input
                  clearable
                  placeholder="请输入发票代码精准查询"
                  searchLabel="发票代码"
                  v-model="formData.invoiceCode"
                ></el-input>
                <el-input
                  clearable
                  placeholder="请输入发票号码精准查询"
                  searchLabel="发票号码"
                  v-model="formData.invoiceNo"
                ></el-input>
                <el-date-picker
                  v-model="formData.createTime"
                  :clearable="true"
                  searchLabel="开票日期"
                  align="right"
                  type="daterange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :picker-options="pickerOptions"
                >
                </el-date-picker>
                <el-input
                  clearable
                  placeholder="请输入销售方名称模糊查询"
                  searchLabel="销售方名称"
                  v-model="formData.sellername"
                ></el-input>
              </template>
              <el-input
                clearable
                placeholder="请输入发票代码精准查询"
                searchLabel="发票代码"
                oninput="value=value.replace(/[^\d]/g,'')"
                slot="searchItem1"
                v-model="formData.invoiceCode"
              ></el-input>
              <el-input
                clearable
                placeholder="请输入发票号码精准查询"
                searchLabel="发票号码"
                oninput="value=value.replace(/[^\d]/g,'')"
                slot="searchItem2"
                v-model="formData.invoiceNo"
              ></el-input>
              <el-date-picker
                slot="searchItem3"
                v-model="formData.createTime"
                :clearable="true"
                searchLabel="开票日期"
                align="right"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :picker-options="pickerOptions"
              >
              </el-date-picker>
              <el-input
                clearable
                placeholder="请输入销售方名称模糊查询"
                searchLabel="销售方名称"
                slot="searchItem4"
                v-model="formData.sellername"
              ></el-input>
            </el-search>
          </div>
          <div class="el-dialog__body-bodys">
            <div class="bodys-right">
              <ux-grid
                :data="tableData"
                keep-source
                widthResize
                show-overflow="title"
                maxHeight="252"
                style="width: 950px"
                @select="handleCheckChange"
                @select-all="handleCheckAllChange"
              >
                <ux-table-column
                  type="checkbox"
                  width="45"
                  fixed="left"
                  show-overflow="none"
                />
                <ux-table-column
                  type="index"
                  title="序号"
                  width="50"
                  fixed="left"
                />

                <ux-table-column
                  title="发票类型"
                  field="invoiceTypeName"
                  width="90"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="发票代码"
                  field="invoiceCode"
                  width="120"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="发票号码"
                  field="invoiceNo"
                  width="90"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="价税合计"
                  field="priceTaxTotal"
                  width="90"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="税额"
                  field="tax"
                  width="90"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="不含税金额(元)"
                  field="amountExcludeTax"
                  width="120"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="开票日期"
                  field="invoiceDate"
                  width="130"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="销售方名称"
                  field="seller"
                  width="150"
                  show-overflow-tooltip
                />
                <ux-table-column
                  title="购买方名称"
                  field="purchaser"
                  width="150"
                  show-overflow-tooltip
                />
                <!-- <ux-table-column
                    title="备注"
                    field="remake"
                    width="120"
                    show-overflow-tooltip
                /> -->
              </ux-grid>
              <!-- <div class="table-footer" style="height: 30px">
              <div class="ccui-table-footer">
                <div id="ccui-paging">
                  <el-pagination
                    :current-page="pageNoCode"
                    :page-size="pageSizeCode"
                    :pager-count="5"
                    :page-sizes="[10, 20, 50, 100, 200, 500]"
                    :total="totalNum"
                    @addCurrentPage="internalCurrentPage"
                    @current-change="handleCurrentChange"
                    @next-click="handleNext"
                    @prev-click="handlePrev"
                    @size-change="handleSizeChange"
                    background
                    layout="total,sizes, prev, pager, next, jumper"
                    next-text="下一页 >"
                    popper-class="ccui-paging-page-size-popper"
                    prev-text="< 上一页"
                  />
                </div>
              </div>
            </div> -->
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="普票引入" name="b">
          <div class="el-dialog__body-header invoice-Search first">
            <el-search
              :formProp="formData2"
              :showIndex="showIndex"
              @change="change"
              @search="search"
              placement="bottom-start"
              width="960px"
            >
              <template slot="search">
                <el-input
                  clearable
                  placeholder="请输入发票代码查询"
                  searchLabel="发票代码"
                  v-model="formData2.invoiceCode"
                ></el-input>
                <el-input
                  clearable
                  placeholder="请输入发票号码查询"
                  searchLabel="发票号码"
                  v-model="formData2.invoiceNo"
                ></el-input>
                <el-input
                  clearable
                  placeholder="请输入校验码后六位查询"
                  searchLabel="校验码"
                  v-model="formData2.checkCode"
                ></el-input>
                <el-date-picker
                  v-model="formData2.invoiceDate"
                  type="date"
                  value-format="yyyy-MM-dd"
                  format="yyyy-MM-dd"
                  searchLabel="开票日期"
                  placeholder="请选择开票日期查询"
                >
                </el-date-picker>
              </template>
              <el-input
                clearable
                placeholder="请输入发票代码查询"
                searchLabel="发票代码"
                oninput="value=value.replace(/[^\d]/g,'')"
                @blur="checkRule()"
                slot="searchItem1"
                :class="{ elRuler: this.isElRuler1 }"
                v-model="formData2.invoiceCode"
              ></el-input>
              <el-input
                clearable
                placeholder="请输入发票号码查询"
                searchLabel="发票号码"
                oninput="value=value.replace(/[^\d]/g,'')"
                @blur="checkRule()"
                slot="searchItem2"
                :class="{ elRuler: this.isElRuler2 }"
                v-model="formData2.invoiceNo"
              ></el-input>
              <el-input
                clearable
                placeholder="请输入校验码后六位查询"
                searchLabel="校验码"
                oninput="value=value.replace(/[^\d]/g,'')"
                @blur="checkRule()"
                slot="searchItem3"
                :class="{ elRuler: this.isElRuler3 }"
                v-model="formData2.checkCode"
              ></el-input>
              <el-date-picker
                :class="{ elRuler: this.isElRuler4 }"
                @blur="checkRule()"
                v-model="formData2.invoiceDate"
                type="date"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
                searchLabel="开票日期"
                placeholder="请选择开票日期查询"
                slot="searchItem4"
              >
              </el-date-picker>
            </el-search>
          </div>
          <div class="el-dialog__body-bodys second">
            <div class="bodys-right">
              <el-table
                border
                :data="tableTicketData"
                :fit="true"
                :lineClamp="lineClampBody"
                maxHeight="252"
                style="width: 990px"
              >
                <!-- <el-table-column type="selection" width="55" /> -->
                <el-table-column label="序号" width="60">
                  <template slot-scope="scope">
                    <span>{{ scope.$index + 1 }}</span>
                  </template>
                </el-table-column>
                <template v-for="(table, index) in unfixedTableThead">
                  <el-table-column
                    :fixed="table.fixed || false"
                    :key="index"
                    :type="table.type"
                    :label="table.label"
                    :align="table.align || 'left'"
                    :header-align="table.headerAlign || 'left'"
                    :min-width="table.width"
                    :prop="table.prop"
                    :show-overflow-tooltip="true"
                    border="true"
                  >
                  </el-table-column>
                </template>
              </el-table>
              <!-- <div class="table-footer" style="height: 30px">
              <div class="ccui-table-footer">
                <div id="ccui-paging">
                  <el-pagination
                    :current-page="pageNoCode"
                    :page-size="pageSizeCode"
                    :pager-count="5"
                    :page-sizes="[10, 20, 50, 100, 200, 500]"
                    :total="totalNum"
                    @addCurrentPage="internalCurrentPage"
                    @current-change="handleCurrentChange"
                    @next-click="handleNext"
                    @prev-click="handlePrev"
                    @size-change="handleSizeChange"
                    background
                    layout="total,sizes, prev, pager, next, jumper"
                    next-text="下一页 >"
                    popper-class="ccui-paging-page-size-popper"
                    prev-text="< 上一页"
                  />
                </div>
              </div>
            </div> -->
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>

      <div slot="footer" class="dialog-footer">
        <el-button size="mini" type="default-mini" @click="handleFalse"
          >取 消</el-button
        >
        <el-button size="mini" type="primary-font-mini" @click="handleTrue"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { querySpecialTicket } from "../api";
import { queryGeneralTicket } from "../api";
import {
  setSessionItem,
  getSessionItem,
  ishasAgentId,
  dateFormat1
} from "@/basa/utils";

export default {
  props: {},
  data() {
    return {
      isElRuler1: false,
      isElRuler2: false,
      isElRuler3: false,
      isElRuler4: false, //控制非空校验框变红
      formDataSearch: {},
      formDataSearchparamBO: {
        invoiceCode: "发票代码",
        invoiceNo: "发票号码",
        checkCode: "校验码",
        invoiceDate: "开票时间"
      },
      showIndex: 0,
      lineClampBody: true,
      tableData: [],
      tableTicketData: [],
      searchData: [],
      tipData: [],
      activeName: "a",
      dialogTableVisibletextarea: false,
      formData: {
        invoiceCode: "",
        invoiceNo: "",
        createTime: "",
        sellername: ""
      },
      formData2: {
        invoiceCode: "",
        invoiceNo: "",
        checkCode: "",
        invoiceDate: ""
      },
      formLabelWidth: "120px",
      pageSizeCode: 10,
      pageNoCode: 1,
      present: "",
      TableData: "",
      total: 0,
      totalNum: 0,
      lastTime: {
        button: false
      },
      pagesize: [5],
      unfixedTableThead: [
        { prop: "invoiceTypeName", label: "发票类型", width: "90" },
        { prop: "invoiceCode", label: "发票代码", width: "90" },
        { prop: "invoiceNo", label: "发票号码", width: "90" },
        { prop: "priceTaxTotal", label: "价税合计", width: "90" },
        { prop: "tax", label: "税额", width: "90" },
        { prop: "amountExcludeTax", label: "不含税金额(元)", width: "120" },
        { prop: "invoiceDate", label: "开票日期", width: "90" },
        { prop: "seller", label: "销售方名称", width: "150" },
        { prop: "purchaser", label: "购买方名称", width: "150" },
        { prop: "remake", label: "备注", width: "120" }
      ],
      choiceDate0: "",
      pickerOptions: {
        // 设置不能选择的日期
        onPick: ({ maxDate, minDate }) => {
          this.choiceDate0 = minDate.getTime();
          if (maxDate) {
            this.choiceDate0 = "";
          }
        },
        disabledDate: time => {
          let choiceDateTime = new Date(this.choiceDate0).getTime();
          const minTime = new Date(choiceDateTime).setMonth(
            new Date(choiceDateTime).getMonth() - 1
          );
          const maxTime = new Date(choiceDateTime).setMonth(
            new Date(choiceDateTime).getMonth() + 1
          );
          const min = minTime;
          const newDate =
            new Date(new Date().toLocaleDateString()).getTime() +
            24 * 60 * 60 * 1000 -
            1;
          const max = newDate < maxTime ? newDate : maxTime; //如果已经选中一个日期 则 返回 该日期前后一个月时间可选
          if (this.choiceDate0) {
            return time.getTime() < min || time.getTime() > max;
          } //若一个日期也没选中 则 返回 当前日期以前日期可选
          return time.getTime() > newDate;
        }
      }
    };
  },
  created() {
    this.activeName = "a";
  },
  methods: {
    handletabClick(tab, event) {
      //换页签初始化数据
      if (tab.name == "a") {
        this.formData2 = {
          invoiceCode: "",
          invoiceNo: "",
          checkCode: "",
          invoiceDate: ""
        };
        this.isElRuler1 = false;
        this.isElRuler2 = false;
        this.isElRuler3 = false;
        this.isElRuler4 = false;
        this.tableTicketData = [];
      } else {
        this.formData = {
          invoiceCode: "",
          invoiceNumber: "",
          createTime: "",
          sellername: ""
        };
        this.TableData = [];
        this.formDataSearch = {
          billStartDate: dateFormat1(Date.now() - 24 * 3600 * 1000 * 31), //进入时初始化时间
          billEndDate: dateFormat1(Date.now() - 24 * 3600 * 1000)
        };
        this.formData.createTime = [
          this.formDataSearch.billStartDate,
          this.formDataSearch.billEndDate
        ]; //时间回显
      }
      // this.getSpecialTicketList(this.formDataSearch)//初始进入获取列表
    },
    checkRule() {
      //失焦取消校验红框
      // console.log(key)
      if (this.formData2.invoiceCode) {
        this.isElRuler1 = false;
      }
      if (this.formData2.invoiceNo) {
        this.isElRuler2 = false;
      }
      if (this.formData2.checkCode) {
        this.isElRuler3 = false;
      }
      if (this.formData2.invoiceDate) {
        this.isElRuler4 = false;
      }
    },
    initSearchData() {
      this.formData = {
        invoiceCode: "",
        invoiceNumber: "",
        createTime: "",
        sellername: ""
      };
      this.formData2 = {
        invoiceCode: "",
        invoiceNo: "",
        checkCode: "",
        invoiceDate: ""
      };
    },
    beforeClose() {
      this.initSearchData();
      this.pageNoCode = 1;
      this.dialogTableVisibletextarea = false;
      this.$emit("closeFlag", this.TableData);
    },
    handleCheckChange(val) {
      this.TableData = val;
      this.TableData.forEach(e => {
        e.state = 1;
      });
      console.log(this.TableData);
    },
    handleCheckAllChange(val) {
      this.TableData = val;
      this.TableData.forEach(e => {
        e.state = 1;
      });
      console.log(this.TableData);
    },
    handleTrue() {
      if (this.activeName == "b") {
        if (this.tableTicketData.length > 0) {
          this.tableTicketData.forEach(e => {
            e.state = 1;
          });
        }
        this.$emit("invoiceData", this.tableTicketData);
      } else {
        this.$emit("invoiceData", this.TableData);
      }
      this.TableData = [];
      this.dialogTableVisibletextarea = false;
    },
    handleFalse() {
      this.TableData = [];
      this.dialogTableVisibletextarea = false;
      this.$emit("closeFlag", this.TableData);
    },
    // inventoryConfirm() {
    //   this.dialogTableVisibletextarea = false;
    //   this.$emit("invoiceData", this.TableData);
    // },

    //普票
    getGeneralTicketList(reqObj) {
      let obj = {};
      obj = typeof reqObj == "object" ? reqObj : obj;

      queryGeneralTicket(obj).then(res => {
        let v = res.data.data;
        let generalTicketData = [{}];
        generalTicketData[0].invoiceTypeName = "普票";
        generalTicketData[0].invoiceCode = v.invoiceCode;
        generalTicketData[0].invoiceNo = v.invoiceNo;
        generalTicketData[0].priceTaxTotal = Number(v.priceTaxTotal).toFixed(2);
        generalTicketData[0].tax = Number(v.tax).toFixed(2);
        generalTicketData[0].amountExcludeTax = Number(
          v.amountExcludeTax
        ).toFixed(2);
        generalTicketData[0].invoiceDate = v.invoiceDate
          ? v.invoiceDate.substring(0, 10)
          : "";
        generalTicketData[0].seller = v.seller;
        generalTicketData[0].purchaser = v.purchaser;
        generalTicketData[0].remake = v.remake;
        console.log("this.generalTicketData", generalTicketData[0]);
        //多个数据不重复添加时打开
        // if(this.tableTicketData.length > 0){
        //     this.tableTicketData.push(...generalTicketData);
        //     for(let i = 0; i < this.tableTicketData.length; i++) {
        //         for(let j = i+1; j < this.tableTicketData.length; j++) {
        //             if(this.tableTicketData[i].invoiceCode === this.tableTicketData[j].invoiceCode
        //             && this.tableTicketData[i].invoiceNo === this.tableTicketData[j].invoiceNo
        //             ){
        //                 this.tableTicketData.splice(j, 1);
        //                 j = j-1;
        //             }
        //         }
        //     }//数组去重
        //   }else{
        //     this.tableTicketData.push(...generalTicketData)
        //   }
        if (this.tableTicketData.length > 0) {
          this.tableTicketData.splice(0, 1);
          this.tableTicketData.push(...generalTicketData);
        } else {
          this.tableTicketData.push(...generalTicketData);
        }
      });
    },
    //专票
    getSpecialTicketList(reqObj) {
      let obj = {};
      obj = typeof reqObj == "object" ? reqObj : obj;
      obj.isShowLoading = true;
      querySpecialTicket(obj).then(res => {
        // console.log(res)
        console.log(res.data);
        // let v = res.data.data
        // let tableSpecialData=[{}];
        // tableSpecialData[0].invoiceTypeName ="普票";
        // tableSpecialData[0].invoiceCode = v.invoiceCode;
        // tableSpecialData[0].invoiceNo = v.invoiceNo;
        // tableSpecialData[0].priceTaxTotal =  Number(v.priceTaxTotal).toFixed(2);
        // tableSpecialData[0].tax =  Number(v.tax).toFixed(2);
        // tableSpecialData[0].amountExcludeTax = Number(v.amountExcludeTax).toFixed(2);
        // tableSpecialData[0].invoiceDate = v.invoiceDate ? v.invoiceDate.substring(0,10) : "";
        // tableSpecialData[0].seller = v.seller;
        // tableSpecialData[0].purchaser = v.purchaser;
        // tableSpecialData[0].remake = v.remake;
        // this.tableData.push(...tableSpecialData)
        if (res.data.code == 0) {
          this.tableData = res.data.data;
          this.tableData.forEach(v => {
            v.invoiceDate = v.invoiceDate.substring(0, 10);
          });
        }
      });
    },

    handleSizeChange(val) {
      this.pageNoCode = 1;
      if (val !== "none") {
        this.pageSizeCode = val;
        setSessionItem("pageSize", this.tableName, val);
      }
      this.getSpecialTicketList(this.formDataSearch);
    },

    handleCurrentChange(val) {
      let searchFormData = getSessionItem("pageNo", this.tableName) || {};
      setSessionItem("pageNo", this.tableName, {
        pageNo: val,
        searchForm: searchFormData.searchForm || {}
      });
      this.formDataSearch = {
        ...this.formDataSearch,
        ...searchFormData.searchForm
      };
      // 跳转翻页都会调这个方法
      this.pageNoCode = val;
      this.getSpecialTicketList(this.formDataSearch);
    },
    internalCurrentPage(val) {
      val = 10;
    },
    handlePrev() {},
    handleNext() {},
    handleGoPage() {},
    search(searchData) {
      this.pageNoCode = 1;
      this.localSearchData = JSON.parse(JSON.stringify(searchData));
      setSessionItem("pageNo", this.tableName, {
        pageNo: this.pageNoCode,
        searchForm: this.localSearchData
      });
      if (
        this.activeName == "b" //普票
      ) {
        this.formDataSearch = {
          invoiceCode: "",
          invoiceNo: "",
          checkCode: "",
          invoiceDate: ""
        };
        for (let x in this.formDataSearch) {
          this.formDataSearch[x] = searchData[x];
        }
        if (
          !this.formDataSearch.invoiceCode ||
          !this.formDataSearch.invoiceNo ||
          !this.formDataSearch.checkCode ||
          !this.formDataSearch.invoiceDate
        ) {
          for (let f in this.formDataSearch) {
            if (!this.formDataSearch[f]) {
              if (f == "invoiceCode") {
                this.isElRuler1 = true;
              }
              if (f == "invoiceNo") {
                this.isElRuler2 = true;
              }
              if (f == "checkCode") {
                this.isElRuler3 = true;
              }
              if (f == "invoiceDate") {
                this.isElRuler4 = true;
              }
              this.tipData.push(this.formDataSearchparamBO[f]);
            } else {
              if (f == "invoiceCode") {
                this.isElRuler1 = false;
              }
              if (f == "invoiceNo") {
                this.isElRuler2 = false;
              }
              if (f == "checkCode") {
                this.isElRuler3 = false;
              }
              if (f == "invoiceDate") {
                this.isElRuler4 = false;
              }
            }
          }
          let tipString = this.tipData.join("，");
          this.$message({
            showClose: true,
            message: `必填项${tipString}未填，请填写后搜索`,
            type: "error",
            ccuiCustom: true,
            duration: 8000
          });
          this.tipData = [];
          return;
        } else {
          if (this.formDataSearch.invoiceCode) {
            this.isElRuler1 = false;
          }
          if (this.formDataSearch.invoiceNo) {
            this.isElRuler2 = false;
          }
          if (this.formDataSearch.checkCode) {
            this.isElRuler3 = false;
          }
          if (this.formDataSearch.invoiceDate) {
            this.isElRuler4 = false;
          }
        }
        console.log("121212121", this.formDataSearch);
        console.log("1323555555>>>", searchData);
        this.getGeneralTicketList(this.formDataSearch);
      }
      if (
        this.activeName == "a" //专票
      ) {
        this.formDataSearch = {
          invoiceCode: "",
          invoiceNumber: "",
          billStartDate: "",
          billEndDate: "",
          sellername: ""
        };
        for (let x in searchData) {
          if (searchData[x].length == 2) {
            this.formDataSearch.billStartDate = searchData[x][0];
            this.formDataSearch.billEndDate = searchData[x][1];
          } else {
            this.formDataSearch[x] = searchData[x];
          }
        }
        this.getSpecialTicketList(this.formDataSearch);
      }
    },
    change(index, key, value) {
      this.showIndex = index;
    }
  },
  computed: {
    pickerOptions1() {
      return {
        disabledDate: time => {
          return (
            time.getTime() < Date.now() - 24 * 3600 * 1000 * 31 ||
            time.getTime() > Date.now() - 24 * 3600 * 1000
          );
        }
      };
    }
  },
  beforeRouteLeave(to, from, next) {
    for (var key in this.$vnode.parent.parent.componentInstance.cache) {
      delete this.$vnode.parent.parent.componentInstance.cache[
        ishasAgentId(to.path, key)
      ];
    }
    next();
  },

  activated() {
    console.log("jinliale");
    this.isElRuler1 = false;
    this.isElRuler2 = false;
    this.isElRuler3 = false;
    this.isElRuler4 = false;
    this.activeName = "a";
    this.TableData = [];
    this.tableTicketData = [];
    this.tableData = [];
    this.initSearchData();
    this.formDataSearch = {
      billStartDate: dateFormat1(Date.now() - 24 * 3600 * 1000 * 31), //进入时初始化时间
      billEndDate: dateFormat1(Date.now() - 24 * 3600 * 1000)
    };
    this.formData.createTime = [
      this.formDataSearch.billStartDate,
      this.formDataSearch.billEndDate
    ]; //时间回显
    // this.formDataSearch.isShowPageLoading = true
    // this.formDataSearch.isShowLoading = true
    this.$nextTick(() => {
      this.getSpecialTicketList(this.formDataSearch); //初始进入获取列表
    });
  }
};
</script>
<style lang="scss" scoped>
// /deep/ .el-searchs-right > .el-input {
//   width: 200px;
// }
/deep/ .el-input .el-pagination__editor .is-in-pagination {
  width: 80px !important;
}
/deep/ .el-dialog__header {
  display: flex;
}
/deep/ .el-dialog__header .el-dialog__title {
  margin-top: 10px;
}

.invoice-Search {
  /deep/ .el-search .el-searchs {
    display: none;
  }
  /deep/ .el-search .ccui-search-wrapper {
    display: none;
  }
  /deep/ .el-search .ccui-form-wrapper-search-button .icon {
    display: none;
  }
  /deep/.el-search .el-searchs-bottom {
    margin-top: 0px;
    padding: 12px 0;
    width: 930px;
    display: block !important;
    .el-col-8 {
      width: 50%;
    }
  }
  /deep/.el-search .el-searchs-bottom-form .el-form-item {
    width: 400px !important;
    margin-bottom: 10px;
  }
  /deep/.el-tabs__header {
    margin: 0 0 !important;
  }
}
/deep/.el-tabs__nav {
  margin-left: 41% !important;
}
.second {
  /deep/.bodys-right {
    float: left !important;
    width: 100%;
  }
}
/deep/.first {
  .el-form-item__label::before {
    margin-left: -9px;
    margin-top: 1px;
    position: absolute;
    content: "*";
    color: #e6122a;
  }
}
/deep/.elRuler {
  .el-input__inner {
    border: 1px solid #e6122a !important;
  }
}
</style>
